<template>
  <div class="pb-60">
    <div class="text-center pt-10">活动图片介绍</div>

    <!-- 轮播图 -->
    <swiper
      :indicator-dots="true"
      :autoplay="true"
      indicator-color="rgba(255,255,255, 0.5)"
      indicator-active-color="#fff"
      :circular="true"
      :interval="3000"
      :duration="500"
      class="mt-20 mb-10"
    >
      <swiper-item
        v-for="(item, index) in images"
        :key="index"
        class="text-center swiper-items"
      >
        <image
          :src="item"
          style="width: 100%; height: 100%"
          mode="aspectFill"
        ></image>
      </swiper-item>
    </swiper>

    <!-- 文字介绍 -->
    <div class="pl-20 pr-20 pt-40 pb-40 text-center border mt-40 mb-40">文明住房活动文字介绍</div>

    <div class="box box-wrap box-between">
      <div class="box box-cener box-column mb-40" style="width: 49%;" v-for="n in 10" :key="n">
        <image
          src="/static/swipe.png"
          style="width: 100%; height: 100px"
          mode="aspectFill"
        ></image>
        <canuse-button class="mt-20">投票</canuse-button>
      </div>
    </div>

  </div>
</template>

<script>
export default {
  data() {
    return {
      images: ["/static/swipe.png", "/static/swipe.png"],
      list: ["社区任务列表"],
      active: 0,
      datas: [{name: '写对联任务'}, {name: '出演T台'}, {name: '寻人启事'}]
    }
  },

  methods: {

    // 社区投票活动列表
    toVote () {
      uni.navigateTo({
        url: `/pages/page/vote`
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.canuse-tabs__wrap /deep/ .canuse-tab.active[data-v-16c34e12]::after {
  background-color: #479995;
}
</style>